<%@ page language="java"
         contentType="text/html; charset=utf-8"
         pageEncoding="utf-8" %>
<%@ page isELIgnored="false" %>
<!-- isELIgnored=true禁用EL表达式 -->
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!-- JSTL格式化标签 -->
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="f" %>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>管理员登陆页面</title>
    <script src="${pageContext.request.contextPath}/js/jquery.min-2.1.1.js"></script>
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/layui-v2.6.13/layui/css/layui.css">
    <script type="text/javascript" src="${pageContext.request.contextPath}/layui-v2.6.13/layui/layui.js"></script>
    <style>
        #updateUser{
            margin-left: 350px;
        }
        .layui-form-item{
            margin-left: 210px;
        }
        .layui-form{
            margin-top: 100px;
        }
        #uNameMsg{
            margin-top: 10px;
        }
        #phoneMsg{
            margin-top: 10px;
        }
    </style>
</head>
<body>
<form class="layui-form" >
    <div class="layui-form-item">
        <label class="layui-form-label">用户名</label>
        <div class="layui-input-inline">
            <input type="text" id="uName" name="uName" placeholder="用户名" autocomplete="off" class="layui-input"
                   value="${user.uName}">
        </div>
        <div class="layui-input-inline">
            <p id="uNameMsg" ></p>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">手机号</label>
        <div class="layui-input-inline">
            <input type="text" id="uPhone" name="uPhone" required  lay-verify="required" placeholder="手机号" autocomplete="off" class="layui-input"
                   value="${user.uPhone}">
        </div>
        <div class="layui-input-inline">
            <p id="phoneMsg" ></p>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">密码</label>
        <div class="layui-input-inline">
            <input type="text" name="uPass" required  lay-verify="required" placeholder="登陆/支付密码" autocomplete="off" class="layui-input"
                   value="${user.uPass}">
        </div>
    </div>
</form>
<button  id="updateUser" type="button" class="layui-btn layui-btn-radius layui-btn-normal" onclick="saveInfo(${sessionScope.u.id})">保存</button>
</body>
<script>
    $(function(){
        //用户名异步认证
        $("#uName").change(function(){
            $.post("${pageContext.request.contextPath}/user/checkUser"+"?uName="+this.value,function(data){
                if(data==="1"){
                    $("#uNameMsg").html("用户名已经存在").css("color","red");
                    $("#updateUser").attr("disabled",true);
                }else{
                    $("#uNameMsg").html("用户名可用").css("color","green");
                    $("#updateUser").removeAttr("disabled");
                }
            })
        });
        //验证手机号
        $("#uPhone").change(function(){
            let arr1=/^[1][3|4|5|7|8|9][0-9]{9}$/;
            var num = this.value;
            if (arr1.test(num)) {
                $.get("${pageContext.request.contextPath}/user/checkUser"+"?uPhone="+this.value,function(data){
                    if(data==="1"){
                        $("#phoneMsg").html("该手机号已注册其他账号").css("color","red");
                        $("#updateUser").attr("disabled", true);
                    }else{
                        $("#phoneMsg").html("手机号可用").css("color", "green");
                        $("#updateUser").removeAttr("disabled");
                    }
                })
            } else {
                $("#phoneMsg").html("请输入正确的手机号！").css("color", "red");
                $("#updateUser").attr("disabled", true);
            }
        });
        //密码
        // $("#uPass").change(function(){
        //     $("#updateUser").removeAttr("disabled");
        // });
    });
    function saveInfo(id){
        var params = $("form").serialize();
        params += "&id="+id;
        console.info(params)
        $.ajax({
            url:"${pageContext.request.contextPath}/user/updateUserInfo",
            type:"post",
            data:params,
            success:function (code){
                if(code === "1"){
                    alert("保存成功");
                    //刷新个人中心
                    <%--window.open("${pageContext.request.contextPath}/user/userPage","_black");--%>
                    <%--window.location.href = "${pageContext.request.contextPath}/user/userPage"--%>
                } else {
                    alert("保存失败");
                }
                window.location.reload();
            }
        });
    }
</script>


</html>
